<template>
    <div style="height: 100%;">
        <div class="flexCenter">
            <div class=" noBg flexCenter flex1 padding10">
                <div class="flex1 flexCenter">
                    <div class="font14 whiteColor pr20">一级指标：</div>
                    <div>
                        <el-select v-model="yjzbVal" class="border1" value-key="orderID">
                            <el-option    v-for="(option) in yjzbSelect"
                                          :key="option.orderID"
                                          :label="option.fieldName"
                                          :value="option"></el-option>
                        </el-select>
                    </div>
                </div>
                <div class="font18 whiteColor flex1 textCenter">{{yjzbVal.score}} <span class="font14 defaultColor">分</span></div>
            </div>
            <!--<div class="rightSj"><img src="../../assets/images/nlpg/rightSj.png" alt=""></div>-->
            <div class=" noBg flexCenter flex1 padding10">
                <div class="flex1 flexCenter">
                    <div class="font14 whiteColor pr20">二级指标：</div>
                    <div>
                        <el-select v-model="ejzbVal" class="border1" value-key="orderID">
                            <el-option    v-for="(option) in yjzbVal.nlpgFormModels"
                                          :key="option.orderID"
                                          :label="option.fieldName"
                                          :value="option"></el-option>
                        </el-select>
                    </div>
                </div>
                <div class="font18 whiteColor flex1 textCenter">{{ejzbVal.score}} <span class="font14 defaultColor">分</span></div>
            </div>
        </div>
        <div class="table border1 mt15" style="overflow-y: auto;height: calc(100% - 120px);">
            <el-table
                    :data="ejzbVal.nlpgFormModels"
                    border
                    width="100%"
            >
                <el-table-column type="index" label="序号" width="60"></el-table-column>
                <el-table-column prop="fieldName" label="三级指标" width="200"></el-table-column>
                <el-table-column prop="score" width="520" label="评分">
                    <template slot-scope="scope">
                        <slider :min=0 :max=100 :index="scope.$index" v-model = "scope.row.score" @savescale="getScale"></slider>
                    </template>
                </el-table-column>
                <el-table-column prop="score" label="打分值" width="160">
                    <template slot-scope="scope">
                        <div class="font18 whiteColor flex1 textCenter">{{scope.row.score}} <span class="font14 defaultColor">分</span></div>
                    </template>
                </el-table-column>
                <el-table-column prop="description"  label="评分标准">
                    <template slot-scope="scope">
                        <div v-html="scope.row.description" style="white-space: pre-line;text-align: left"></div>
                    </template>
                </el-table-column>
            </el-table>
        </div>
        <div class="textRight mt20">
            <el-button
                    class="btnDefault"
                    @click="savePf"
            >保存
            </el-button>
            <el-button
                    class="btnDefault"
                    @click="getTable"
            >取消
            </el-button>
        </div>
    </div>
</template>

<script>
    import slider from "../base/slider"
    import {baseServe} from "../../request/api";

    export default {
    data() {
      return {
        yjzbVal: "",
        yjzbSelect: [
          {
            "fieldID": "CABC1C1CB96DA374794E",
            "weight": 0.64,
            "score": 52.73,
            "description": null,
            "fieldName": "防护措施",
            "nlpgFormModels": [
              {
                "fieldID": "88585D5091728E5BE61F",
                "weight": 0.45,
                "score": 53.0,
                "description": null,
                "fieldName": "被动防护",
                "nlpgFormModels": [
                  {
                    "fieldID": "707B705CE6051D589EED",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"重要经济目标的布局合理，考虑周全   （75,100]\n重要经济目标的布局比较合理             (50,75]\n重要经济目标的布局有一些不合理      (25,50]\n重要经济目标的布局有较多不合理之处  [0,25]\"\r\n",
                    "fieldName": "布局合理性",
                    "nlpgFormModels": null,
                    "orderID": 1,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "B1261264D3D6428995B9",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"关键设备和要害部位都采取重点防护   （75,100]\n大部分关键设备和要害部位都采取重点防护   （50,70]\n一部分关键设备和要害部位都采取重点防护   （25,50]\n小部分关键设备和要害部位都采取重点防护   [0,25]\"\r\n",
                    "fieldName": "重点防护措施",
                    "nlpgFormModels": null,
                    "orderID": 2,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "D9E5F75241A137FBB082",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"关键设备和重要战略物资等都能够转入地下   （75,100]\n大部分关键设备和重要战略物资等能够转入地下   （50,70]\n一部分关键设备和重要战略物资等能够转入地下   （25,50]\n小部分关键设备和重要战略物资等能够转入地下   [0,25]\"\r\n",
                    "fieldName": "物资转移条件",
                    "nlpgFormModels": null,
                    "orderID": 3,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "379D8E8BEC099B892175",
                    "weight": 0.1,
                    "score": 70.0,
                    "description": "\"具有工人掩蔽工程，且都能正常使用，满足所有掩蔽需要        (50,100]\n具有工人掩蔽工程，部分能使用，不足以满足所有掩蔽需要     (20,50]\n不具有工人掩蔽工程               (0,20]\"\r\n",
                    "fieldName": "掩蔽工程",
                    "nlpgFormModels": null,
                    "orderID": 4,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "FFFF546C031406A716FA",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"网络防护能力强           （75,100]\n网络防护能力较强       （50,70]    \n网络防护能力一般       （25,50]\n不具有网络防护能力      (0,20]\"\r\n",
                    "fieldName": "网络防护",
                    "nlpgFormModels": null,
                    "orderID": 5,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "32C3E4E4D6D6C000EA03",
                    "weight": 0.1,
                    "score": 60.0,
                    "description": "\"具有很强的战前对关键设备等应急加固的能力  （75,100]\n具有较强的战前对关键设备等应急加固的能力  （50,70]    \n具有较弱的战前对关键设备等应急加固的能力  （25,50]\n具有很弱的战前对关键设备等应急加固的能力    (0,20]\"\r\n",
                    "fieldName": "应急加固能力",
                    "nlpgFormModels": null,
                    "orderID": 6,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "DAC0DD4067C4534A762C",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"具有较多的隐蔽伪装措施手段和隐蔽伪装器材        (50,100]\n具有较少的隐蔽伪装措施手段和隐蔽伪装器材        (20,50]\n不具有隐蔽伪装措施手段和隐蔽伪装器材                (0,20]\"\r\n",
                    "fieldName": "隐蔽伪装措施",
                    "nlpgFormModels": null,
                    "orderID": 7,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "9C0601DBF84A8C9F820D",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"所有关键生产设备均有冗余生产配置        (50,100]\n部分关键生产设备有冗余生产配置              (20,50]\n所有关键生产设备均没有冗余生产配置         (0,20]\"\r\n",
                    "fieldName": "冗余生产配置",
                    "nlpgFormModels": null,
                    "orderID": 8,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "F968188764E8FC586C93",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"工业企业建有自备水源、电源等基础设施     (50,100]\n工业企业未建自备水源、电源等基础设施     (0,50]\"\r\n",
                    "fieldName": "基础设施配备",
                    "nlpgFormModels": null,
                    "orderID": 9,
                    "pid": "88585D5091728E5BE61F"
                  },
                  {
                    "fieldID": "E8384FE6A07C843CAA54",
                    "weight": 0.1,
                    "score": 50.0,
                    "description": "\"战时抢险抢修的队伍和装备充足           (50,100]\n只有部分战时抢险抢修的队伍和装备      (20,50]\n没有抢险抢修的队伍和装备                       (0,20]\"\r\n",
                    "fieldName": "防护专业力量",
                    "nlpgFormModels": null,
                    "orderID": 10,
                    "pid": "88585D5091728E5BE61F"
                  }
                ],
                "orderID": 1,
                "pid": "CABC1C1CB96DA374794E"
              },
              {
                "fieldID": "179E0F8B7C954B1C08D7",
                "weight": 0.55,
                "score": 52.5,
                "description": null,
                "fieldName": "主动防护",
                "nlpgFormModels": [
                  {
                    "fieldID": "F901A24E482DABAED349",
                    "weight": 0.25,
                    "score": 50.0,
                    "description": "\"有很强的对来袭作战飞机或制导导弹进行侦查告警的能力            （75,100]\n有较强的能够对来袭作战飞机或制导导弹进行侦查告警的能力     （50,70]   \n有较弱的对来袭作战飞机或制导导弹进行侦查告警的能力            （20,50]\n有很弱的能够对来袭作战飞机或制导导弹进行侦查告警的能力     （0,50]   \"\r\n",
                    "fieldName": "侦察告警能力",
                    "nlpgFormModels": null,
                    "orderID": 1,
                    "pid": "179E0F8B7C954B1C08D7"
                  },
                  {
                    "fieldID": "9E282B620CD45EBCBA77",
                    "weight": 0.25,
                    "score": 50.0,
                    "description": "\"具有多种能够干扰制导武器信号传播的干扰系统    （50,100]   \n具有少量能够干扰制导武器信号传播的干扰系统    （20,50]      \n不具有能够干扰制导武器信号传播的干扰系统    （0,20]            \"\r\n",
                    "fieldName": "信号干扰能力",
                    "nlpgFormModels": null,
                    "orderID": 2,
                    "pid": "179E0F8B7C954B1C08D7"
                  },
                  {
                    "fieldID": "E53F95C8A4D127D70052",
                    "weight": 0.25,
                    "score": 50.0,
                    "description": "\"配备有多种空中拦截能力的武器系统 ，空中拦截能力强   （50,100]   \n配备有空中拦截能力的武器系统 ，空中拦截能力较强         （20,50]  \n未配备具有空中拦截能力的武器系统 ，空中拦截能力较强    （0,20]        \"\r\n",
                    "fieldName": "空中拦截能力",
                    "nlpgFormModels": null,
                    "orderID": 3,
                    "pid": "179E0F8B7C954B1C08D7"
                  },
                  {
                    "fieldID": "225FA4477EF51BDA8C66",
                    "weight": 0.25,
                    "score": 60.0,
                    "description": "配备具有主动抗毁能力较强的武器系统，主动抗毁能力较强\\r（50,100]\\r\\n配备具有主动抗毁能力较弱的武器系统，主动抗毁能力较弱\\r（20,50]\\r\\n未配备具有主动抗毁能力的武器系统，无主动抗毁能力\\n（0,20]",
                    "fieldName": "主动抗毁能力",
                    "nlpgFormModels": null,
                    "orderID": 4,
                    "pid": "179E0F8B7C954B1C08D7"
                  }
                ],
                "orderID": 2,
                "pid": "CABC1C1CB96DA374794E"
              }
            ],
            "orderID": 1,
            "pid": "-1"
          },
          {
            "fieldID": "6ACCB23AA7E74E1A6D5F",
            "weight": 0.36,
            "score": 52.04,
            "description": null,
            "fieldName": "安全管理",
            "nlpgFormModels": [
              {
                "fieldID": "30DB3ABAC5047A5EFDA0",
                "weight": 0.67,
                "score": 56.0,
                "description": null,
                "fieldName": "预防措施",
                "nlpgFormModels": [
                  {
                    "fieldID": "612221E387EE61F606AC",
                    "weight": 0.2,
                    "score": 60.0,
                    "description": "\"有完善的专家咨询队伍和科研机构做支撑    （50,100]   \n没有完善的专家咨询队伍和科研机构做支撑    （20,50]  \n没有专家咨询队伍和科研机构做支撑      （0,20]  \"\r\n",
                    "fieldName": "专家库支持",
                    "nlpgFormModels": null,
                    "orderID": 1,
                    "pid": "30DB3ABAC5047A5EFDA0"
                  },
                  {
                    "fieldID": "B87991FE851AB47D23E2",
                    "weight": 0.2,
                    "score": 50.0,
                    "description": "\"有完善的战备值班计划和战备值班监督机构   （50,100]   \n没有完善的专家咨询队伍和科研机构做支撑    （20,50]  \n没有专家咨询队伍和科研机构做支撑      （0,20]  \"\r\n",
                    "fieldName": "战备值班计划",
                    "nlpgFormModels": null,
                    "orderID": 2,
                    "pid": "30DB3ABAC5047A5EFDA0"
                  },
                  {
                    "fieldID": "E86C1BDC537F7D40D6EE",
                    "weight": 0.2,
                    "score": 50.0,
                    "description": "\"有健全的重要经济目标防护规章制度和完善的战时防护预案    （50,100]   \n没有健全的重要经济目标防护规章制度和完善的战时防护预案    （20,50]  \n没有重要经济目标防护规章制度和战时防护预案                        （0,20]  \"\r\n",
                    "fieldName": "防护规章制度",
                    "nlpgFormModels": null,
                    "orderID": 3,
                    "pid": "30DB3ABAC5047A5EFDA0"
                  },
                  {
                    "fieldID": "2432817F1E5E2A3544B8",
                    "weight": 0.2,
                    "score": 60.0,
                    "description": "\"具有多种渠道的战时安全生产宣传载体   （50,100]   \n具有少量渠道的战时安全生产宣传载体     （20,50]  \n没有战时安全生产宣传载体                          （0,20]  \"\r\n",
                    "fieldName": "宣传教育",
                    "nlpgFormModels": null,
                    "orderID": 4,
                    "pid": "30DB3ABAC5047A5EFDA0"
                  },
                  {
                    "fieldID": "4859EDFFB8CDF83C09A2",
                    "weight": 0.2,
                    "score": 60.0,
                    "description": "\"经常进行一般员工、关键工人和管理人员的战时安全生产培训   （50,100]   \n偶尔进行一般员工、关键工人和管理人员的战时安全生产培训     （20,50]  \n没有一般员工、关键工人和管理人员的战时安全生产培训             （0,20]  \"\r\n",
                    "fieldName": "安全生产培训",
                    "nlpgFormModels": null,
                    "orderID": 5,
                    "pid": "30DB3ABAC5047A5EFDA0"
                  }
                ],
                "orderID": 3,
                "pid": "6ACCB23AA7E74E1A6D5F"
              },
              {
                "fieldID": "B52435848B934B18362B",
                "weight": 0.33,
                "score": 44.0,
                "description": null,
                "fieldName": "应急响应",
                "nlpgFormModels": [
                  {
                    "fieldID": "87DE2B6DD8E48C06C770",
                    "weight": 0.2,
                    "score": 50.0,
                    "description": "\"能够快速转入战时体制    （50,100]   \n能够较快速转入战时体制    （20,50]  \n不能快速转入战时体制    （0,20]  \"\r\n",
                    "fieldName": "平战转换能力",
                    "nlpgFormModels": null,
                    "orderID": 1,
                    "pid": "B52435848B934B18362B"
                  },
                  {
                    "fieldID": "E7C626E0AC9A31432AED",
                    "weight": 0.2,
                    "score": 50.0,
                    "description": "\"有专业的处置危险源的队伍和装备，危险源处置能力很强          （75,100]\n有较专业的处置危险源的队伍和装备，危险源处置能力较强        （50,70]   \n有少量专业的处置危险源的队伍和装备，危险源处置能力较弱    （20,50]\n没有专业的处置危险源的队伍和装备，危险源处置能力差              （0,20]   \"\r\n",
                    "fieldName": "危险源处置能力",
                    "nlpgFormModels": null,
                    "orderID": 2,
                    "pid": "B52435848B934B18362B"
                  },
                  {
                    "fieldID": "98996DD603ADDB380261",
                    "weight": 0.2,
                    "score": 50.0,
                    "description": "\"有完善的战时紧急停产计划                 （50,100]   \n有战时紧急停产计划，但不完善           （20,50]  \n没有战时紧急停产计划                            （0,20]  \"\r\n",
                    "fieldName": "战时紧急停产计划",
                    "nlpgFormModels": null,
                    "orderID": 3,
                    "pid": "B52435848B934B18362B"
                  },
                  {
                    "fieldID": "4796E8B3C7F36EDB1D04",
                    "weight": 0.2,
                    "score": 20.0,
                    "description": "\"设置有完善的应急通讯系统，能全时段与应急救援机构联络畅通   （75,100]\n设置有较完善的应急通讯系统，偶尔不能与救援机构联通                （50,70]   \n应急通讯系统不完善，经常不能与救援机构联通                               （20,50]\n没有应急通讯系统，不能与救援机构联通                                             （0,20]   \"\r\n",
                    "fieldName": "应急通信",
                    "nlpgFormModels": null,
                    "orderID": 4,
                    "pid": "B52435848B934B18362B"
                  },
                  {
                    "fieldID": "F15332AB592321051E43",
                    "weight": 0.2,
                    "score": 50.0,
                    "description": "\"设置有应急指挥机构，定期进行战时防护演练     （50,100]   \n设置有应急指挥机构，偶尔进行战时防护演练     （20,50]  \n未设置有应急指挥机构，无战时防护演练             （0,20]  \"\r\n",
                    "fieldName": "应急指挥机构能力",
                    "nlpgFormModels": null,
                    "orderID": 5,
                    "pid": "B52435848B934B18362B"
                  }
                ],
                "orderID": 4,
                "pid": "6ACCB23AA7E74E1A6D5F"
              }
            ],
            "orderID": 2,
            "pid": "-1"
          }
        ],
        ejzbVal: "",
        ejzbSelect: []
      };
    },
    computed: {
      zyjjmbId() {
        return this.$store.state.zyjjmbId;
      },
    },
    watch:{
    },
    mounted() {
        this.getTable()
    },
    methods: {
      savePf(){
        baseServe.setTableNlpg({nlpgFormModels:this.yjzbSelect,zyjjmbID:this.zyjjmbId}).then(res=>{
          this.$message({
            message: "保存成功!",
            type: "success"
          });
        })
      },
      getTable(){
        baseServe.getTableNlpg({zyjjmbID:this.zyjjmbId}).then(res=>{
          if(res.data.nlpgFormModels){
            this.yjzbSelect=res.data.nlpgFormModels
            if(this.yjzbSelect[0]){
              this.yjzbVal=this.yjzbSelect[0]
                if(this.yjzbSelect[0].nlpgFormModels&&this.yjzbSelect[0].nlpgFormModels.length>0){
                  this.ejzbVal=this.yjzbSelect[0].nlpgFormModels[0]
                }
            }
          }
        })
      },
      getScale(val){
        this.ejzbVal.nlpgFormModels[val.index].score=(val.value*100).toFixed(0)
      }
    },
    components: {
      slider
    }
  };
</script>


<style scoped lang="less">
.rightSj{
    padding: 10px;
}
    .nobgBtn{
        margin-right: 80px;
        background-color: transparent;
    }
</style>
